*
  margin: 0
  padding: 0

html, body
  height: 100%;
  width: 100%;
  background-color: #f5f5f5;
  .header
    height: 1.173333333rem
    line-height 1.1733333333rem
    background-color #f8f8f8
    border-bottom: 1px solid #d6d6d6;
    display: flex; /*Flex布局*/
    justify-content space-between
    padding: 0 0.26666666667rem
    a
      display: flex; /*Flex布局*/
      align-items: center; /*指定垂直居中*/
      .header-icon
        display: inline-block
        width: 0.8rem
        height: 0.8rem
  .content
    background white
    .video
      background-color black
      width: 100%
      height: 5.333333333333rem
    .video-h
      position: relative
      padding: 0 0.426666666666667rem;
      margin-top 0.453333333333rem;
      margin-right: 0.64rem;
      font-size: 0.48rem
      &:hover .video-details-arrow
        transform rotate(90deg)
      .video-details-arrow
        width 0.4266666667rem
        height: 0.4266666666666667rem
        display: inline-block
        background: url("../img/videoPage/icon/feedback-icon.png") no-repeat;
        background-size contain
        transform rotate(-90deg)
        position: absolute
        top: 0
        right: 0
      .play-times
        color: #999
        font-size 0.32rem
        line-height: 0.48rem
      .video-details
        display: none
        p
          font-size: 0.32rem;
          line-height: 0.48rem;
          color: #999;
          font-weight 400
      &:hover .video-details
        display: block
  .open-app
    border-top: 1px solid #eee;
    margin-top 0.266666666667rem;
    padding: 0.053333333333rem 0.4533333333333rem
    a
      text-decoration none
      .open-button
        margin 0.453333333333333rem
        border 1px solid black
        border-radius 0.13333333333333333rem
        display flex
        align-items center
        justify-content center
        height: 1.12rem
        .open-app-icon
          width: 0.6666666666667rem
          height: 0.666666666666667rem
          margin-right: 0.26666666666667rem
        .open-button-text
          color: #666
          font-size: 0.42666666666666666667rem

.maybe-you-like
  background-color white
  margin-top 0.2666666666666666667rem
  a
    color: #333
    .like
      padding: 0.373333333333333333rem 0.426666666666667rem;
      .like-img
        display: inline-block
        width 2.933333333333333333rem
        height: 1.97333333333333333333rem
        background: url("../img/videoPage/icon/maybe-like.jpg") no-repeat
        background-size contain
        position relative
        .pay-time
          color: white
          background: rgba(0, 0, 0, 0.5)
          display: inline-block
          border-radius 0.2133333333333333333rem
          padding-right: 0.26666666666666666667rem;
          padding-left: 0.58666666666666667rem;
          font-size: 0.266666666666666666667rem;
          position: absolute
          right: 0.1333333333333333333rem
          bottom: 0.13333333333333333333rem
          &:before
            content ''
            width: 0
            height: 0
            display inline-block
            border 5px solid transparent
            border-left-color: white
            position absolute
            left: 0.34666666666666666666667rem
            top: 0
            bottom: 0
            margin: auto
    .like-text
      display: inline-block
      width 5.46666666666666666666667rem
      vertical-align top
      margin-left 0.26666666666666666667rem
      span
        display inline-block
        width: 5.4133333333333333333333rem
        font-size 0.48rem
      p
        color: #999
        font-size 0.3466666666666666666666666667rem
        margin-top 0.1866666666666666666666666667rem





